<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>修改用户信息</title>
        <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
        <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
        <script type="text/javascript"  src="http://www.ijquery.cn/js/html5shiv.js"></script>
        <![endif]-->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="js/jquery-1.12.4.min.js">\x3C/script>')</script>
        <!--也可以用yepnopejs 加载器;直接是window对象-->
        <!--Font Awesome  一套绝佳的图标字体库和CSS框架 无需依赖JavaScript 无限缩放  完全免费 jquery-confirm里面用到 官网http://fontawesome.dashgame.com/-->
        <link href="css/font-awesome/css/font-awesome.min.css" rel="stylesheet">
        <!-- bootstrap 3.0.2 -->
        <link href="css/bootstrap-3.2.0/css/bootstrap.css" rel="stylesheet" type="text/css" />
        <link href="css/bootstrap-box.css" rel="stylesheet" type="text/css" />
        <link href="css/bootstrap-page.css" rel="stylesheet" type="text/css" />
        <link href="js/nice-validator/jquery.validator.css" rel="stylesheet" type="text/css" />
        <link href="js/jquery-confirm/jquery-confirm.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="js/bootstrap.min.js"></script>
        <script type="text/javascript" src="js/jquery-confirm/jquery-confirm.js"></script>
        <script type="text/javascript" src="js/jsviews.js"></script>
        <script type="text/javascript" src="js/loadTmpl.js"></script>
        <script type="text/javascript" src="js/nice-validator/jquery.validator.min.js"></script>
        <script type="text/javascript" src="js/nice-validator/local/zh-CN.js"></script>
        <script type="text/javascript" src="js/layer/layer.js"></script>
        <script src="js/base.js" type="text/javascript"></script>

        <script type="text/javascript">
        	$.views.converters("ischecked",function(first,last){
        		var flag=false;
        		for(var i=0;i<last.length;i++){
        			var _rid=last[i].roleId;
        			if(first ==_rid){
        				flag=true;
	        			break;
        			} 
        		}
    			return flag? "checked=checked":"";
    		});
			$(function(){
				var userId=getUrlParam("userId");
				if(userId==""){
					myAlert("userId参数不能为空");
					return;
				}
				$("#userId").val(userId);
				var url =root+'xaCmsUser/'+userId;
				$.ajax({
					url:url,
					type:'get',
					dataType:'json',
					success:function(data){
						var userContentHtml=$("#userTmpl").render(data);
						$("#usercontent").html(userContentHtml);
					}
				});
				
				$('#demo_31').validator({
					valid: function(form){
						var userId=$("#userId").val();
						var selectArray =new Array();	//下拉选中项
						$("input[name='roleCkBox']:checked").each(function () {
							selectArray.push($(this).val());
		                });
						var userName=$("#userName").val();
						var realName=$("#realName").val();
						var password=$("#password").val();
						var mobile=$("#mobile").val();
						var email=$("#email").val();
						var description=$("#description").val();
						var selectRole=""+selectArray+"";
						var xaCmsUser="";
						var url="";
						var ajaxType="";
						if(typeof(userId)=="undefined"){
							//新增
							xaCmsUser={"userName":userName,"realName":realName,"password":password,"mobile":mobile,"email":email,"description":description};
							url=root+"xaCmsUser/addUser/"+selectRole;
							ajaxType="POST";
						}else{
							//修改
							xaCmsUser={"userId":userId,"userName":userName,"realName":realName,"mobile":mobile,"email":email,"description":description};
							url=root+"xaCmsUser/update/"+selectRole;
							ajaxType="POST";
						}
						$.ajax({
							url:url,
							type:ajaxType,
							datType:'json',
							contentType: "application/json",
							data:JSON.stringify(xaCmsUser),
							success:function(data){
								if(data.status=1){
									window.location.href="userList.html";
								}
							}
						});
				    }
				}).on("click","#saveOrupdate",function(e){
					$(e.delegateTarget).trigger("validate");
				});
				
			});
        </script>
    </head>
    <body>
      <section>
          <div>
           <form id="demo_31" class="form-horizontal">
              <div class="col-xs-12">
                  <div class="box">
                      <div class="box-header">
                          <input type="button" value="确定" id="saveOrupdate" class="btn btn-success">
                          <a  href="userList.html" class="btn btn-info" >返回</a>
                      </div>
              		</div>
                      <div class="box-body table-responsive" id="usercontent">
                  	</div>
          		</div>
           </form>
      </section>
      <script type="text/x-jsrender" id="userTmpl">
		{{if user}}
			<input type="hidden" id="userId" value="{{:user.userId}}" />
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label" >用户名：</label>
				<div class="col-sm-8">
         		<input type="text" data-rule="用户名:required;username;" id="userName" readonly="readonly" class="form-control" value="{{:user.userName}}" 
            				placeholder="请输入用户名">
				</div>
   			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label" >真实姓名：</label>
				<div class="col-sm-8">
         		<input type="text" data-rule="真实姓名:required;length[2~30]" id="realName" class="form-control" value="{{:user.realName}}" 
            				placeholder="请输入真实姓名">
				</div>
   			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label">手机号：</label>
				<div class="col-sm-8">
         			<input type="text" data-rule="手机号:required;mobile" id="mobile" class="form-control" value="{{:user.mobile}}" 
            				placeholder="请输入手机号">
				</div>
   			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label">email：</label>
				<div class="col-sm-8">
         			<input type="text" data-rule="email:required;email;" id="email" class="form-control" value="{{:user.email}}" 
            				placeholder="请输入email">
				</div>
   			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label">描述：</label>
				<div class="col-sm-8">
         			<textarea id="description" class="form-control" rows="3" data-rule="描述:required;length[1~255]" cols="50">{{:user.description}}</textarea>
				</div>
			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label">角色：</label>
				<div class="col-sm-8">
					{{for role}}
         				<input type="checkbox" data-rule="checked[1~]" id="roleCk_{{:roleId}}" value="{{:roleId}}" name="roleCkBox" {{ischecked:roleId #parent.parent.data.userRole}} />{{:roleName}}
      				{{/for}}

   				</div>
   			</div>
		{{else}}
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label" >用户名：</label>
				<div class="col-sm-8">
         		<input type="text" class="form-control" name="userName" data-rule="用户名:required;username;remote[get:xaCmsUser/checkUserName]" id="userName" 
            				placeholder="请输入用户名">
				</div>
   			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label" >真实姓名：</label>
				<div class="col-sm-8">
         		<input type="text" data-rule="真实姓名:required;length[2~30]" id="realName" class="form-control" placeholder="请输入真实姓名">
				</div>
   			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label" >密码：</label>
				<div class="col-sm-8">
         		<input type="password" data-rule="密码:required;password;" name="mypass" id="password" class="form-control" placeholder="请输入密码">
				</div>
   			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label" >确认密码：</label>
				<div class="col-sm-8">
         		<input type="password" data-rule="确认密码:required;match(mypass);" id="password1" class="form-control"  placeholder="请输入确认密码">
				</div>
   			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label" >手机号：</label>
				<div class="col-sm-8">
         		<input type="text" data-rule="手机号:required;mobile" id="mobile" placeholder="请输入手机号"  class="form-control">
				</div>
   			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label" >email：</label>
				<div class="col-sm-8">
         		<input type="text" data-rule="email:required;email;length[5~255]" id="email" placeholder="请输入email"  class="form-control">
				</div>
   			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label" >描述：</label>
				<div class="col-sm-8">
				<textarea id="description" data-rule="描述:required;length[1~255, true]" rows="3" class="form-control" cols="50"></textarea>
				</div>
   			</div>
			<div class="form-group">
      			<label for="firstname" class="col-sm-2 control-label" >角色：</label>
				<div class="col-sm-8">
				{{for role}}
					<input type="checkbox" data-rule="checked[1~]" id="roleCk_{{:roleId}}" value="{{:roleId}}" name="roleCkBox" />{{:roleName}}
				{{/for}}
				</div>
   			</div>
		{{/if}}
			
	</script>
      
    </body>
</html>